.TechnologicalInnovationA01 {
	width: 100%;
	height: 100%;
	padding: 8px;
	display: flex;
	align-items: center;
	justify-content: center;

	& > div {
		height: 100%;
		padding: 8px;

		&.Left {
			flex: 390;
			border-right: 2px solid rgba(174, 226, 255, 1);
		}

		&.Right {
			flex: 1487;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
		}

		& > div {
			width: 100%;

			&.Top {
				height: 120px;
				display: flex;
				align-items: center;
				justify-content: space-evenly;
				background: rgba(17, 101, 192, 0.2);

				& > div {
					display: flex;
					align-items: center;
					justify-content: center;
					cursor: pointer;

					& > div:first-child {
						width: 72px;
						height: 62px;
						position: relative;
						z-index: 1;
						margin-right: 16px;

						& > img:first-child {
							position: absolute;
							left: 0;
							top: 0;
							width: 100%;
							height: 100%;
							z-index: 1;
							display: block;
						}

						& > img:last-child {
							position: absolute;
							left: 20px;
							top: 0;
							width: 32px;
							height: 32px;
							z-index: 2;
							display: block;
						}
					}

					& > div:last-child {
						display: flex;
						align-items: flex-start;
						justify-content: center;
						flex-direction: column;

						& > div:first-child {
							font-family: MicrosoftYaHei, MicrosoftYaHei;
							font-weight: bold;
							font-size: 12px;
							color: #cafcff;
							margin-bottom: 4px;
						}

						& > div:last-child {
							position: relative;
							z-index: 1;
							display: flex;
							align-items: center;
							justify-content: center;

							& > div:first-child {
								font-family: YouSheBiaoTiHei;
								width: 78px;
								font-size: 30px;
								color: #cafcff;
								line-height: 22px;
								text-shadow: 3px 4px 2px #18528d;
								margin-right: 8px;

								& > img {
									position: absolute;
									left: -12px;
									bottom: -8px;
									width: 78px;
									height: 22px;
									z-index: -1;
									display: block;
								}
							}

							& > div:last-child {
								font-family: MicrosoftYaHei, MicrosoftYaHei;
								font-weight: bold;
								font-size: 12px;
								color: #cafcff;
							}
						}
					}
				}
			}

			&.Btm {
				flex: 1;
				display: flex;
				align-items: center;
				justify-content: center;

				& > div {
					flex: 1;
					height: 100%;
					margin: 0 8px;
					display: flex;
					align-items: center;
					justify-content: flex-start;
					flex-direction: column;

					& > .options {
						width: 100%;
						display: flex;
						align-items: center;
						justify-content: space-between;
						height: 32px;

						& > div:first-child {
							display: flex;
							align-items: center;
							justify-content: center;
							height: 100%;

							& > div {
								display: flex;
								align-items: center;
								justify-content: center;
								height: 100%;
								padding: 0 32px;
								background: rgba(13, 50, 89, 1);
								font-family: MicrosoftYaHei;
								font-size: 14px;
								color: #ffffff;
								cursor: pointer;

								&.active {
									background: linear-gradient(
										180deg,
										rgba(185, 30, 0, 1),
										rgba(255, 190, 98, 1)
									);
								}
							}
						}
					}

					& > .TimeSelect {
						text-align: right;
					}

					& > div {
						width: 100%;

						&.Charts {
							flex: 1;
						}
					}
				}
			}
		}
	}
}
